@import '../../../theme.less';

.roleListContainer {
  @media (max-width: @screen-xs) {
    flex-wrap: wrap;
  }

  .leftPart {
    :global {
      .ant-pro-card-body {
        padding: 0 !important;
      }
    }

    height: 100%;
    overflow-y: auto;
    flex-wrap: wrap;
    min-height: 220px;
    background-color: @card-background;
    border-radius: 2px;

    .header {
      width: 100%;
      height: 60px;
      border-bottom: 1px dashed #f0f0f0;

      :global {
        .ant-btn-text:hover,
        .ant-btn-text:focus {
          color: @text-color;
          background: @card-head-background;
        }
      }

      .button {
        font-size: 15px;
        height: 60px;
        margin-left: -0.1em;
        padding-left: 24px;
        text-align: left;
        vertical-align: -1em;
      }
    }

    .menuList {
      min-height: 230px;

      li {
        margin-bottom: 8px !important;
      }

      .menuItem {
        width: 100%;
        display: flex;
        justify-content: space-between;

        .count {
          color: @secondary-color;
        }
      }

      :global {
        .ant-table-cell {
          vertical-align: top;
        }

        .more-actions {
          height: 40px;
          line-height: 46px;
          opacity: 0 !important;
        }

        .ant-menu-item-active .more-actions {
          opacity: 1 !important;
        }

        li.ant-menu-item {
          margin: 0 0;
        }

        .ant-menu-item-selected::after {
          opacity: 0 !important;
        }

        .ant-menu-item::before {
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          z-index: 1;
          border-right: 3px solid @primary-color;
          transform: scaleY(0.0001);
          opacity: 0;
          transition: transform 0.15s cubic-bezier(0.215, 0.61, 0.355, 1),
          opacity 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
          content: '';
        }

        .ant-menu-title-content {
          display: flex !important;
          justify-content: space-between !important;

          .i-icon {
            display: flex;
            align-items: center;
          }
        }

        .ant-menu-item-selected {
          color: @text-color;
        }

        .ant-menu-item-selected::before {
          transform: scaleY(1);
          opacity: 1;
          transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
          opacity 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
        }
      }
    }
  }

  .rightPart {
    .tabPane {
      padding: 0 28px 12px 28px;
    }



    :global {
      .ant-pro-card-body {
        padding: 0;
      }

      .ant-tabs-nav {
        height: 60px;
      }

      .ant-tabs-nav-list {
        padding-left: 28px;
      }

      .ant-tabs-tab-btn {
        font-size: 15px;
      }

      .ant-tabs-extra-content {
        padding-right: 20px;
      }

      th.ant-table-cell {
        height: 50px;
        padding-left: 20px !important;
        //background-color: #fcfcfc !important;
      }

      td.ant-table-cell {
        padding-left: 20px !important;
      }

      .ant-table-pagination-right {
        padding-right: 0;
        margin-right: 0 !important;
      }
    }
  }
}

